<template>
	<view class="normal-login-container">
		<view class="logo-content align-center justify-center flex">
			<view class="logo">
				<!-- <image  src="" > -->
			</view>
			</image>
		</view>
		<view class="login-form-content">
			<view class="input-item flex align-center">
				<input v-model="loginForm.phone" class="input" type="text" placeholder="请输入手机号" maxlength="30" />
			</view>

			<view class="action-btn">
				<button @click="handleLogin" class="login-btn cu-btn block bg-purple lg round">Send Verifcation
					Code</button>
			</view>
			<view class="xieyi text-center">
				<uv-checkbox-group v-model="checkboxValue">
					<uv-checkbox name="1"></uv-checkbox>
				</uv-checkbox-group>
				<view class="">
					<text class="text-grey1 mtxt-5">I agree to the</text>
					<text @click="handleUserAgrement" class="text-purple"> Terms of Service</text>
					<text class="mtxt-5"> & </text>
					<text @click="handlePrivacy" class="text-purple">Privacy Policy</text>
				</view>

			</view>
		</view>

	</view>
</template>

<script>

	export default {
		data() {
			return {
				loginForm: {
					phone: "13155838807",
				},
				checkboxValue: [],
				// 基本案列数据


			}
		},
		methods: {
			handleLogin() {
				uni.navigateTo({
					url:'../loginCode/loginCode'
				});
			}

		}
	}
</script>
<style lang="scss" scoped>
	page {
		background-color: #ffffff;
		padding:40rpx;
	}

	.normal-login-container {
		width: 100%;

		.logo-content {
			width: 100%;
			font-size: 42rpx;
			text-align: center;
			padding-top: 220rpx;

			.logo {
				width: 200rpx;
				height: 200rpx;
				background: #F3F3F3;
				border-radius: 60rpx;
			}
		}

		.login-form-content {
			text-align: center;
			margin: 160rpx auto;
			margin-top: 15%;
			width: 90%;

			.input-item {
				margin: 20px auto;
				background-color: #f5f6f7;
				height: 100rpx;
				border-radius: 60rpx;

				.icon {
					font-size: 38rpx;
					margin-left: 10px;
					color: #999;
				}

				.input {
					width: 100%;
					text-align: left;
					padding-left: 15px;
				}

			}

			.login-btn {
				margin-top: 40rpx;
				height: 100rpx;
				font-size: 28rpx;
				font-weight: 400;
			}

			.reg {
				margin-top: 15px;
			}

			.xieyi {
				color: #333;
				font-size: 24rpx;
				margin-top: 100rpx;
				display: flex;
				align-items: center;

				::v-deep .uv-checkbox-group {
					flex: none;
				}

				.mtxt-5 {
					margin: 0 10rpx;
				}

				.text-grey1 {
					color: #666;
					font-weight: 400;
				}
			}


			.login-code {
				height: 38px;
				float: right;

				.login-code-img {
					height: 38px;
					position: absolute;
					margin-left: 10px;
					width: 200rpx;
				}
			}
		}
	}
</style>